
<div class="container-fluid">
	
	<div class="row-fluid">
	<strong class="h3 pull-left">Release: {{release.name}} {{release.version}}&nbsp;</strong>
	<form role="form" class="form-inline pull-left">
		
			<div class="form-group">
				<input type="text" id="search-box-filter" placeholder="Filter results" ng-model="query" class="form-control">				
			</div>
			
			<div class="form-group">
				<label for="search-box-order" class="control-label">Sort by:</label>
				<select  ng-model="orderProp" class="form-control" id="search-box-order">					
					<option value="latest.label">Label (A-Z)</option>
					<option value="-latest.label">Label (Z-A)</option>
					<option value="latest.types">Type (A-Z)</option>
					<option value="-latest.types">Type (Z-A)</option>
				</select>
			</div>
		</form>
	</div>
	<div class="clearfix"></div>
	
	<div class="row-fluid">
		<div ng-repeat="history in metrics | filter:query | orderBy:orderProp" class="release-metric pull-left" id="{{metric.name}}">
			<div class="{{history.latest.types.join(' ')}}">
				<div class="metric-header">
					<strong>{{history.latest.label}}</strong>
					
				</div>
				
				<div class="metric-data widget">
					<render-metric type="auto" values="history.values" metric="history.latest">
						Graph not rendered yet.
					</render-metric>
				</div>		

				<div class="metric-footer">
					<div>
						Value:
						<input class="metric-value" type="number" 
							ng-keypress-enter="updateMetric(history.latest)"
							ng-model="history.latest.value" id="metric_value_{{history.latest._id}}">
					</div>
					<div class="tags">Tags: {{history.latest.types.join(', ')}}</div>
				</div>				
			</div>
		</div>
	</div>	
</div>

